<template>
  <div>
    <van-address-list
      v-model="chosenAddressId"
      :list="list"
      @add="onAdd"
      @select="selectAddress"
      @edit="onEdit"
    >
    </van-address-list>
  </div>
</template>

<script>
export default {
    name: "addressList",
    data() {
        return {
            chosenAddressId: "1",
            list: [
                
            ],
       
        };
    },

    methods: {
        getList() {
            this.$http.post('/shop/userDeliAddr/front/getDeliAddrList').then(res => {
                if (res.status === 0) {
                    if (!res.data || res.data.length === 0) {
                        this.$toast('暂无更多');
                        return;
                    }
                    this.list = res.data.map(e => {
                        return { name: e.deliName, tel: e.tel, id: e.addrId, address: `${e.provinceName}${e.cityName}${e.districtName}${e.address}`}
                    });
                } else {
                    this.$toast.fail(res.message);
                }
            })
        },

        selectAddress(item) {
            if (this.$route.query.type !== 'select') { return; }
            localStorage.setItem('selectAddrId', item.id);
            this.$router.back();
        },
        onAdd() {
            this.$router.push('add')
        },

        onEdit(item) {
            this.$router.push('edit?addrid=' + item.id)
        }
    },

    mounted() {
        this.getList();
    }
};
</script>

<style scoped lang="scss">
@import './../../assets/default.scss';
/deep/ .van-address-item .van-radio__label {
    padding-left: 0;
}
/deep/ .van-address-item .van-radio__icon {
    opacity: 0;
}

/deep/ .van-button--danger {
    background-color: #ff6700;
    border-radius: 0;
    border: 1px solid #ff6700;
}
</style>
